<template>
  <el-dialog :title="title" :visible.sync="dialogVisible" :close-on-click-modal="false" width="1000px">
    <div class="form-box">
      <el-form ref="form" :model="form" :inline="true" :rules="rules" label-width="auto" class="demo-ruleForm" v-if="type=='push'">
        <el-form-item label="云函数地址" prop="pushUrl">
          <el-input type="textarea" style="width: 300px;" v-model="form.pushUrl" placeholder="DCloud平台配置的推送云函数地址" />
        </el-form-item>
        <br />
        <el-form-item label="小米">
          <label for="">
            <b>即时消息Channel</b>
            <el-input v-model="form.xiaomi.im.channel" placeholder="小米推送服务申请的即时消息通道ID" />
          </label>
        </el-form-item><br />
        <el-form-item label="OPPO">
          <label for="">
            <b>即时消息Channel</b>
            <el-input v-model="form.oppo.im.channel" placeholder="OPPO推送服务申请的即时消息通道ID" />
          </label>

        </el-form-item><br />
        <el-form-item label="VIVO">
          <label for="">
            <b>回执ID</b>
            <el-input v-model="form.vivo.callbackId" placeholder="VIVO推送平台的回执ID" />
          </label>
        </el-form-item><br />

      </el-form>
      <el-form ref="form" :model="form" :inline="true" :rules="rules" label-width="auto" class="demo-ruleForm" v-if="type=='qiniu'">
        <!-- "uploadUrl": "",
          "domain": "",
          "accessKey": "",
          "secretKey": "",
          "bucket": "" -->
        <el-form-item label="accessKey" prop="accessKey">
          <el-input type="textarea" style="width: 400px;" v-model="form.accessKey" placeholder="七牛云的accessKey" />
        </el-form-item>
        <el-form-item label="secretKey" prop="secretKey">
          <el-input type="textarea" style="width: 400px;" v-model="form.secretKey" placeholder="七牛云的secretKey" />
        </el-form-item>
        <el-form-item label="bucket" prop="bucket">
          <el-input type="text" style="width: 400px;" v-model="form.bucket" placeholder="七牛云的bucket" />
        </el-form-item>
        <el-form-item label="上传Url" prop="uploadUrl">
          <el-input type="textarea" style="width: 400px;" v-model="form.uploadUrl" placeholder="七牛云的上传地址" />
        </el-form-item><br />
        <el-form-item label="图片域名" prop="domain">
          <el-input type="text" style="width: 400px;" v-model="form.domain" placeholder="图片回显的域名" />
        </el-form-item>

      </el-form>
      <!-- 应用商店推广配置 -->
      <el-form ref="form" :model="form" :rules="rules" label-width="auto" class="demo-ruleForm" v-if="type=='appStore'">
        <!-- <el-form-item label="是否启用" prop="state">
          <el-input type="text" v-model="form.state" placeholder="是否启用  1启用 2禁用" />
        </el-form-item>
        <br /> -->
        <el-form-item label="联调OAID">
          <el-input v-model="form.testId" placeholder="商店推广联调OAID" />
        </el-form-item>

        <el-form-item label="小米">
          <label for="">
            <b>状态：</b>
            <el-radio-group v-model="form.xiaomi.state">
              <el-radio :label="1">启用</el-radio>
              <el-radio :label="2">停用</el-radio>
            </el-radio-group>
          </label>
          <div class="fn_list">
            <div v-for="item in form.xiaomi.fnList" :key="item.name">
              <b>{{item.nameLabel}}：</b>
              <el-input v-model="item.key" placeholder="key" />

              <b style="margin-left:20px">状态：</b>
              <el-radio-group v-model="item.state">
                <el-radio :label="1">启用</el-radio>
                <el-radio :label="2">停用</el-radio>
              </el-radio-group>
            </div>
          </div>
        </el-form-item><br />
        <el-form-item label="华为">
          <label for="">
            <b>状态：</b>
            <el-radio-group v-model="form.huawei.state">
              <el-radio :label="1">启用</el-radio>
              <el-radio :label="2">停用</el-radio>
            </el-radio-group>
          </label><br />
          <div class="fn_list">
            <div>
              <b>APPID：</b>
              <el-input v-model="form.huawei.appId" placeholder="华为商店APPID" />
            </div>
            <div>
              <b>client_id：</b>
              <el-input v-model="form.huawei.client_id" placeholder="华为商店client_id" />
            </div>
            <div>
              <b>client_secret：</b>
              <el-input v-model="form.huawei.client_secret" placeholder="华为商店client_secret" />
            </div>

          </div>
          <div class="fn_list">
            <div v-for="item in form.huawei.fnList" :key="item.name">
              <b>{{item.nameLabel}}：</b>
              <el-radio-group v-model="item.state">
                <el-radio :label="1">启用</el-radio>
                <el-radio :label="2">停用</el-radio>
              </el-radio-group>
            </div>
          </div>
        </el-form-item><br />
        <el-form-item label="VIVO">
          <label for="">
            <b>状态：</b>
            <el-radio-group v-model="form.vivo.state">
              <el-radio :label="1">启用</el-radio>
              <el-radio :label="2">停用</el-radio>
            </el-radio-group>
          </label><br />
          <div class="fn_list">
            <div>
              <b>access_token：</b>
              <el-input v-model="form.vivo.access_token" placeholder="access_token" />
            </div>
            <div>
              <b>refresh_token：</b>
              <el-input v-model="form.vivo.refresh_token" placeholder="refresh_token" />
            </div>
            <div>
              <b>client_id：</b>
              <el-input v-model="form.vivo.client_id" placeholder="client_id" />
            </div>
            <div>
              <b>client_secret：</b>
              <el-input v-model="form.vivo.client_secret" placeholder="client_secret" />
            </div>
            <div>
              <b>packger_name：</b>
              <el-input v-model="form.vivo.packger_name" placeholder="packger_name" />
            </div>
            <div>
              <b>resource_id：</b>
              <el-input v-model="form.vivo.resource_id" placeholder="resource_id" />
            </div>
            <div>
              <b>advertiser_id：</b>
              <el-input v-model="form.vivo.advertiser_id" placeholder="advertiser_id" />
            </div>

          </div>
          <div class="fn_list">
            <div v-for="item in form.vivo.fnList" :key="item.name">
              <b>{{item.nameLabel}}：</b>
              <el-radio-group v-model="item.state">
                <el-radio :label="1">启用</el-radio>
                <el-radio :label="2">停用</el-radio>
              </el-radio-group>
            </div>
          </div>
        </el-form-item><br />
        <el-form-item label="OPPO">
          <label for="">
            <b>状态：</b>
            <el-radio-group v-model="form.oppo.state">
              <el-radio :label="1">启用</el-radio>
              <el-radio :label="2">停用</el-radio>
            </el-radio-group>
          </label><br />
          <div class="fn_list">
            <div>
              <b>salt：</b>
              <el-input v-model="form.oppo.salt" placeholder="OPPO商店salt" />
            </div>
            <div>
              <b>pkg：</b>
              <el-input v-model="form.oppo.pkg" placeholder="OPPO商店pkg" />
            </div>
            <div>
              <b>adId：</b>
              <el-input v-model="form.oppo.adId" placeholder="OPPO商店adId" />
            </div>
            <div>
              <b>base64Key：</b>
              <el-input v-model="form.oppo.base64Key" placeholder="OPPO商店base64Key" />
            </div>

          </div>
          <div class="fn_list">
            <div v-for="item in form.oppo.fnList" :key="item.name">
              <b>{{item.nameLabel}}：</b>
              <el-radio-group v-model="item.state">
                <el-radio :label="1">启用</el-radio>
                <el-radio :label="2">停用</el-radio>
              </el-radio-group>
            </div>
          </div>
        </el-form-item><br />

      </el-form>

      <div class="center">
        <el-button @click="del()" v-if="this.settingId" type="danger">删除</el-button>
        <el-button @click="close()">取消</el-button>
        <el-button type="primary" @click="submitForm('form')" v-loading="loading">提交</el-button>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import {
  addtenantPushSettings,
  getTenantPushSettingsByTenantId,
  delTenantPushSettings,
} from "@/api/system/shopManage";
export default {
  name: "",
  data() {
    return {
      dialogVisible: false,
      loading: false,
      title: "",
      // 表单参数
      form: {
        pushUrl: "",
        xiaomi: {
          im: {
            channel: "",
          },
          state: 1,
          fnList: [
            {
              state: 1,
              name: "register",
              nameLabel: "注册",
              key: "",
            },
            {
              state: 1,
              name: "pay",
              nameLabel: "支付",
              key: "",
            },
            {
              state: 1,
              name: "active",
              nameLabel: "激活",
              key: "",
            },
            {
              state: 1,
              name: "consulting",
              nameLabel: "咨询",
              key: "",
            },
          ],
        },
        oppo: {
          im: {
            channel: "",
          },
          salt: "",
          pkg: "",
          adId: "",
          base64Key: "",
          fnList: [
            {
              state: 1,
              name: "register",
              nameLabel: "注册",
              key: "",
            },
            {
              state: 1,
              name: "pay",
              nameLabel: "支付",
              key: "",
            },
            {
              state: 1,
              name: "active",
              nameLabel: "激活",
              key: "",
            },
            {
              state: 1,
              name: "consulting",
              nameLabel: "咨询",
              key: "",
            },
          ],
        },
        vivo: {
          callbackId: "",
          state: 1,
          access_token: "",
          refresh_token: "",
          client_id: "",
          client_secret: "",
          packger_name: "",
          resource_id: "",
          advertiser_id: "",
          fnList: [
            {
              state: 1,
              name: "register",
              nameLabel: "注册",
              key: "",
            },
            {
              state: 1,
              name: "pay",
              nameLabel: "支付",
              key: "",
            },
            {
              state: 1,
              name: "active",
              nameLabel: "激活",
              key: "",
            },
            {
              state: 1,
              name: "consulting",
              nameLabel: "咨询",
              key: "",
            },
          ],
        },
        huawei: {
          callbackId: "",
          state: 1,
          appId: "",
          client_id: "",
          client_secret: "",
          fnList: [
            {
              state: 1,
              name: "register",
              nameLabel: "注册",
              key: "",
            },
            {
              state: 1,
              name: "pay",
              nameLabel: "支付",
              key: "",
            },
            {
              state: 1,
              name: "active",
              nameLabel: "激活",
              key: "",
            },
            {
              state: 1,
              name: "consulting",
              nameLabel: "咨询",
              key: "",
            },
          ],
        },
        uploadUrl: "",
        domain: "",
        accessKey: "",
        secretKey: "",
        bucket: "",
      },
      isEdit: false,
      flag: "",
      rules: {
        pushUrl: [{ required: true, message: "请输入", trigger: "blur" }],
        type: [{ required: true, message: "请输入", trigger: "change" }],
        intervalDays: [
          { required: true, message: "请输入", trigger: "change" },
        ],
      },
      tenantId: "",
      tenantName: "",
      settingId: "",
      type: "",
      typeMap: {
        push: 1,
        qiniu: 2,
        appStore: 3,
      },
    };
  },
  created() {},
  methods: {
    // 打开弹窗
    open(tenantId, tenantName, type) {
      this.type = type;
      this.reset();
      this.dialogVisible = true;
      this.tenantId = tenantId;
      this.tenantName = tenantName;
      this.handleUpdate();
    },
    // 重置
    reset() {
      if (this.type == "push") {
        this.title = "推送参数配置";
        this.form = {
          pushUrl: "",
          xiaomi: {
            im: {
              channel: "",
            },
          },
          oppo: {
            im: {
              channel: "",
            },
          },
          vivo: {
            callbackId: "",
          },
        };
      } else if (this.type == "appStore") {
        this.title = "应用商店推广配置";
        this.form = {
          xiaomi: {
            state: 2,
            fnList: [
              {
                state: 1,
                name: "register",
                nameLabel: "注册",
                key: "",
              },
              {
                state: 1,
                name: "pay",
                nameLabel: "支付",
                key: "",
              },
              {
                state: 1,
                name: "active",
                nameLabel: "激活",
                key: "",
              },
              // {
              //   state:1,
              //   name:'retention',
              //   nameLabel:'次留',
              //   key:''
              // },
              {
                state: 1,
                name: "consulting",
                nameLabel: "咨询",
                key: "",
              },
            ],
          },
          oppo: {
            state: 2,
            salt: "",
            pkg: "",
            adId: "",
            base64Key: "",
            fnList: [
              {
                state: 1,
                name: "register",
                nameLabel: "注册",
                key: "",
              },
              {
                state: 1,
                name: "pay",
                nameLabel: "支付",
                key: "",
              },
              {
                state: 1,
                name: "active",
                nameLabel: "激活",
                key: "",
              },
              {
                state: 1,
                name: "consulting",
                nameLabel: "咨询",
                key: "",
              },
            ],
          },
          vivo: {
            state: 2,
            access_token: "",
            refresh_token: "",
            client_id: "",
            client_secret: "",
            packger_name: "",
            resource_id: "",
            advertiser_id: "",
            fnList: [
              {
                state: 1,
                name: "register",
                nameLabel: "注册",
                key: "",
              },
              {
                state: 1,
                name: "pay",
                nameLabel: "支付",
                key: "",
              },
              {
                state: 1,
                name: "active",
                nameLabel: "激活",
                key: "",
              },
              {
                state: 1,
                name: "consulting",
                nameLabel: "咨询",
                key: "",
              },
            ],
          },
          huawei: {
            state: 2,
            appId: "",
            client_id: "",
            client_secret: "",
            fnList: [
              {
                state: 1,
                name: "register",
                nameLabel: "注册",
                key: "",
              },
              {
                state: 1,
                name: "pay",
                nameLabel: "支付",
                key: "",
              },
              {
                state: 1,
                name: "active",
                nameLabel: "激活",
                key: "",
              },
              // {
              //   state:1,
              //   name:'retention',
              //   nameLabel:'次留',
              //   key:''
              // },
              {
                state: 1,
                name: "consulting",
                nameLabel: "咨询",
                key: "",
              },
            ],
          },
        };
      } else if (this.type == "qiniu") {
        this.title = "七牛云配置";
        this.form = {
          uploadUrl: "",
          domain: "",
          accessKey: "",
          secretKey: "",
          bucket: "",
        };
      }
    },
    // // 选择用户改变
    // iotypeChange(e) {
    //   this.allUsers.forEach(r => {
    //     if (r.userId == e) {
    //       this.form.name = r.nickName
    //     }
    //   })
    // },
    // // 获取全部用户
    // getAllUserList() {
    //   supplyConfigApi.getAllUserList().then(res => {
    //     this.allUsers = res.rows
    //   })
    // },
    /** 查询详情进行回显 */
    handleUpdate() {
      let type = this.typeMap[this.type];
      getTenantPushSettingsByTenantId({
        tenantId: this.tenantId,
        type: type,
      }).then((res) => {
        if (res.data && res.data.settingsJson) {
          this.settingId = res.data.id;
          this.form = { ...this.form, ...JSON.parse(res.data.settingsJson) };
          if (this.type == "appStore") {
            if (!this.form.vivo.fnList) {
              this.form.vivo = {
                state: 2,
                access_token: "",
                refresh_token: "",
                client_id: "",
                client_secret: "",
                packger_name: "",
                resource_id: "",
                advertiser_id: "",
                fnList: [
                  {
                    state: 1,
                    name: "register",
                    nameLabel: "注册",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "pay",
                    nameLabel: "支付",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "active",
                    nameLabel: "激活",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "consulting",
                    nameLabel: "咨询",
                    key: "",
                  },
                ],
              };
            }
            if (!this.form.oppo.fnList) {
              this.form.oppo = {
                state: 2,
                salt: "",
                pkg: "",
                adId: "",
                base64Key: "",
                fnList: [
                  {
                    state: 1,
                    name: "register",
                    nameLabel: "注册",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "pay",
                    nameLabel: "支付",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "active",
                    nameLabel: "激活",
                    key: "",
                  },
                  {
                    state: 1,
                    name: "consulting",
                    nameLabel: "咨询",
                    key: "",
                  },
                ],
              };
            }
          }
        }
      });
    },
    del() {
      delTenantPushSettings(this.settingId).then((res) => {
        this.$message.success(res.msg);
        this.dialogVisible = false;
      });
    },
    submitForm(formName) {
      this.$refs["" + formName].validate((valid) => {
        if (valid) {
          let type = this.typeMap[this.type];
          addtenantPushSettings({
            tenantId: this.tenantId,
            tenantName: this.tenantName,
            settingsJson: JSON.stringify(this.form),
            type: type,
            testId: this.form.testId || "",
          }).then((res) => {
            this.$message.success(res.msg);
            this.dialogVisible = false;
          });
        } else {
          this.$alert("请填写完整！");
        }
      });
    },
    close() {
      this.dialogVisible = false;
    },
  },
};
</script>
<style scoped lang="scss">
.tip {
  color: rgb(0, 162, 255);
  padding-left: 110px;
}
.fn_list {
  /* 设置浅灰色边框 */
  border: 1px solid #f3f3f3;
  /* 设置圆角 */
  border-radius: 4px;
  padding: 10px 15px;
  > div {
    margin-bottom: 10px;
  }
}
</style>
